import React from 'react';
import { View, StyleSheet, Alert } from 'react-native';
import {
    useThemeColors,
    Navigation,
    UI,
    Layout,
} from '@gaozh1024/rn-toolkit';
import { SCREEN_NAMES } from '../../config';

export default function UIScreen() {
    const colors = useThemeColors();

    return (
        <Layout.Page
            scrollable={true}
            headerProps={{
                title: 'Layout'
            }}
        >
            <UI.Button title={'Avatar'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_AVATAR_TEST)} />
            <UI.Button title={'Badge'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_BADGE_TEST)} />
            <UI.Button title={'Button'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_BUTTON_TEST)} />
            <UI.Button title={'Checkbox'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_CHECKBOX_TEST)} />
            <UI.Button title={'Chip'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_CHIP_TEST)} />
            <UI.Button title={'Divider'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_DIVIDER_TEST)} />
            <UI.Button title={'Radio'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_RADIO_TEST)} />
            {/* 新增：Icon 测试入口 */}
            <UI.Button title={'Icon'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_ICON_TEST)} />
            {/* 新增：IconButton 测试入口 */}
            <UI.Button title={'IconButton'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_ICON_BUTTON_TEST)} />
            {/* 新增：ListItem 测试入口 */}
            <UI.Button title={'Input'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_INPUT_TEST)} />
            <UI.Button title={'ListItem'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_LIST_ITEM_TEST)} />
            <UI.Button title={'PasswordInput'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_PASSWORD_INPUT_TEST)} />
            <UI.Button title={'Text'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_TEXT_TEST)} />
            <UI.Button title={'Progress'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_PROGRESS_TEST)} />
            <UI.Button title={'ChatBubble'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_CHATBUBBLE_TEST)} />
            <UI.Button title={'TextArea'} fullWidth mt={12}
                onPress={() => Navigation.navigate(SCREEN_NAMES.UI_TEXTAREA_TEST)} />

        </Layout.Page >
    );
}
